{include file="public/header"}
<body>
<div id="app">
    <div class="ht-main">
        <div class="ht-tool">
            <div class="ht-tool-left">
                <el-button type="success" size="mini" icon="el-icon-plus" @click="doAdd">添加</el-button>
                <el-button type="primary" :disabled="tableSelect.length !== 1" size="mini" icon="el-icon-edit"
                           @click="edit(tableSelect[0])">编辑
                </el-button>
                <el-button type="danger" :disabled="!tableSelect.length" size="mini" icon="el-icon-delete"
                           @click="batchDel('/admin/category/del')">删除
                </el-button>
            </div>
            <div class="ht-tool-right">
            </div>
        </div>
        <div class="ht-main-body">
            <el-table :data="tableData" border header-row-class-name="ht-table-header">
                <el-table-column
                        align="center"
                        prop="id"
                        label="ID"
                        width="90">
                </el-table-column>
                <el-table-column
                        align="center"
                        prop="user_name"
                        label="登录名"
                        width="150">
                </el-table-column>
                <el-table-column align="center" prop="real_name" label="姓名"></el-table-column>
                <el-table-column align="center" prop="pinyin" label="简称编码"></el-table-column>
                <el-table-column align="center" prop="phone" label="电话"></el-table-column>
                <el-table-column align="center" prop="diggings.title" label="矿区"></el-table-column>
                <el-table-column
                        align="center"
                        prop="status"
                        label="状态"
                        width="100">
                    <template slot-scope="scope">
                        <el-switch v-model="scope.row.status"
                                   active-color="#13ce66"
                                   inactive-color="#eeeeee"
                                   @change="changeStatus($event,scope.row.id)"
                                   :active-value="1"
                                   :inactive-value="0">
                        </el-switch>
                    </template>
                </el-table-column>
                <el-table-column
                        align="center"
                        prop="authGroup.title"
                        label="用户组"
                        width="120">
                </el-table-column>
                <el-table-column align="center"
                                 prop="create_time"
                                 label="添加时间"
                                 width="180">
                </el-table-column>

                <el-table-column
                        align="center"
                        label="操作"
                        width="210">set
                    <template slot-scope="scope">
                        <!-- <el-button @click="set(scope.row)" size="mini" type="primary">设置矿区</el-button> -->
                        <el-button @click="edit(scope.row)" size="mini" type="primary" icon="el-icon-edit"></el-button>
                        <el-button @click="del(scope.row)" v-if="scope.row.id !== 1" size="mini" type="danger" icon="el-icon-delete"></el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="ht-main-page">
                <el-pagination
                        @size-change="handleSizeChange"
                        @current-change="handleCurrentChange"
                        :current-page="page"
                        :page-sizes="[1,10, 200, 300, 400]"
                        :page-size="limit"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="total">
                </el-pagination>
            </div>
            <el-drawer
                    :visible.sync="is_edit"
                    size="90%"
                    :with-header="false"
                    custom-class="ht-drawer-bg"
            >
                <div class="ht-drawer-main">
                    <el-page-header @back="goBack" title="Esc返回" :content="content"></el-page-header>
                    <div class="ht-form">
                        <el-form :model="editData" label-width="90px" size="small">
                            <el-form-item label="用户组">
                                <el-select v-model="editData.auth_group_id">
                                    <el-option :label="item.title" :value="item.id" v-for="(item,index) in authGroup" :key="index"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="矿区">
                                <el-select v-model="editData.diggings_id" placeholder="请选择矿区">
                                    <el-option :label="item.title" :value="item.id" v-for="(item,index) in diggings_list" :key="index"></el-option>
                                </el-select>
                            </el-form-item>
                            <el-form-item label="登录名">
                                <el-input placeholder="登录名" v-model="editData.user_name"
                                          style="width: 50%"></el-input>
                            </el-form-item>
                            <el-form-item label="密码">
                                <el-input placeholder="密码" v-model="editData.pass_word"
                                          style="width: 50%" type="password"></el-input>
                            </el-form-item>
                            <el-form-item label="姓名">
                                <el-input placeholder="姓名" v-model="editData.real_name"
                                          style="width: 50%"></el-input>
                            </el-form-item>
                            <el-form-item label="简称">
                                <el-input placeholder="简称" v-model="editData.pinyin"
                                          style="width: 50%"></el-input>
                            </el-form-item>
                            <el-form-item label="电话">
                                <el-input placeholder="电话" v-model="editData.phone" style="width: 50%"></el-input>
                            </el-form-item>
                            <el-form-item>
                                <el-button @click="goBack">取消</el-button>
                                <el-button type="primary" @click="onSubmit">提交</el-button>
                            </el-form-item>
                        </el-form>
                    </div>
                </div>
            </el-drawer>
            <el-dialog :visible.sync="dialogVisible" title="设置">
                <el-form size="mini">

                </el-form>
                <span slot="footer" class="dialog-footer">
                    <el-button @click="dialogVisible = false">取 消</el-button>
                    <el-button type="primary" @click="doSet">确 定</el-button>
                </span>
            </el-dialog>
        </div>

    </div>
</div>


{include file="public/common"}
<script>
    let vs
    var vm = new Vue({
        el: "#app",
        data: function () {
            return {
                arctypeList: [],
                activeTab: 'first',
                tableData: [],
                is_edit: false,
                editData: {
                    "user_name": '',
                    "pass_word": '',
                    "auth_group_id": '',
                    "phone":"",
                    "email": "",
                    "real_name":"",
                },
                editDataTemp: {
                    "user_name": '',
                    "pass_word": '',
                    "auth_group_id": '',
                    "phone":"",
                    "email": "",
                    "real_name":"",
                },
                content: '编辑',
                total: 0,
                page: 1,
                limit: 10,
                diggings_id:'',
                search_arctype_id: "",
                search_title: "",
                editBody: '13123',
                department_id: [],
                category_list:[],
                authGroup:[],
                dialogVisible:false,
                current_row:{},
                current_cate:[],
                diggings_list:[]
            }
        },
        created: function () {
            vs = this
            this.getData()
            this.getAuthGroup()
            this.getDiggings()
        },
        methods: {
            getDiggings() {
                Api.request("{:url('Diggings/all')}").then(res=>{
                    vs.diggings_list = res.data
                })
            },
            set(row) {
                vs.dialogVisible = true
                vs.current_row = row
            },
            doSet() {
                Api.request("{:url('admin/setDiggings')}",{
                    id:vs.current_row.id,
                    diggings_id:vs.current_row.diggings_id
                }).then(res=>{
                    vs.dialogVisible = false
                    vs.getData()
                })
            },
            getAdminCategory(row) {
                Api.request("{:url('Production/getAdminCategory')}",{admin_id:row.id}).then(res=>{
                    vs.category_list = res.data.category
                    vs.current_cate = res.data.checked
                })
            },
            success(path){
                vs.$set(vs.editData,"qrcode",path)
            },
            changeStatus: function (e, id) {
                var that = this
                axios.post("{:url('Admin/adminUserStatus')}", {id: id}).then((res) => {
                    if (res.data.code == 1) {
                        Helper.showSuccessMsg(that)
                    } else {
                        Helper.showErrorMsgCall(that,res.data.msg,function (){
                            location.reload()
                        })
                    }
                })
            },
            doSearch: function () {
                this.getData()
            },
            onSubmit() {
                Api.request('{:url("Admin/adminUserAdd")}',vs.editData).then(res=>{
                    vs.showSuccessMsgCall(()=>{
                        vs.is_edit = false
                        vs.getData()
                    })
                })
            },
            getDepartmentList() {
                Api.request('/admin/lan.department/getDepartmentTreeList').then(res=>{
                    vs.department_list = res.data
                })
            },
            getData: function () {
                var that = this
                axios.post('{:url("Admin/adminUserList")}', {
                    limit: that.limit,
                    page: that.page,
                }).then((res) => {
                    console.log(res.data)
                    that.tableData = res.data.data.data
                    that.total = res.data.data.total
                    that.pre_view = that.tableData.map(function (item,index,arr){
                        return item.litpic
                    })
                })
            },
            doAdd: function () {
                this.is_edit = true
                this.content = '添加'
                this.editData = this.editDataTemp
            },
            edit: function (data) {
                this.is_edit = true
                this.content = '编辑'
                this.editData = data
                console.log(data)
            },
            goBack: function () {
                this.is_edit = false
            },
            del: function (data) {
                var that = this
                that.$confirm('确定删除么?', '提示', {
                    type: 'warning',
                    lockScroll: false
                }).then(() => {
                    axios.post('{:url("Admin/adminUserDel")}', {id: data.id}).then((res) => {
                        let result = res.data;
                        if (result.code === 1) {
                            that.showSuccessMsgCall(function () {
                                location.reload()
                            })
                        } else {
                            that.showErrorMsg(result.msg)
                        }
                    })
                })
            },
            handleSizeChange: function (e) {
                this.limit = e
            },
            handleCurrentChange: function (e) {
                this.page = e
            },
            getAuthGroup(){
                var that = this
                $.post('{:url("Ajax/getAuthGroup")}',function (res){
                    if (res.code == 1) {
                        that.authGroup = res.data
                    }
                })
            }
        },
        watch: {
            page(v) {
                this.getData()
            },
            limit() {
                this.getData()
            }
        }
    })
</script>
</body>
</html>
